<html xmlns:html="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!-- dean.edwards/2004 -->
<!-- keeping code tidy! -->
<head>
<title>IE7 Test Page</title>
<meta name="author" content="Dean Edwards"/>
<!-- compliance patch for microsoft browsers -->
<!--[if lt IE 7]>
<script src="ie7-standard.js" type="text/javascript"></script>
<script src="ie7-css3.js" type="text/javascript"></script>
<script src="ie7-css-strict.js" type="text/javascript"></script>
<![endif]-->
<link rel="stylesheet" href="ie7-server.css" type="text/css"/>
<style type="text/css"><!--
h3 {margin: 0.1em 0em;}
h2 {background-color: black; color: white; font-style: normal;}
--></style>
</head>

<body>
<div class="document">
<div class="header">
<h1><a href="index.html"><img src="ie7-logo.gif" width="320" height="40" alt="IE7 { css2: auto; }"/></a></h1>
<hr />
</div>

<div class="content">

<h2>Black &amp; White Test</h2>

<h3>Legend</h3>
<style type="text/css"><!--
 div.legend {height: 20px; font-weight: bold; text-indent: 4px;}
 #fail {background: black; color: white;}
 #pass {background: white; color: black;}
--></style>
<div class="legend" id="pass">PASS</div>
<div class="legend" id="fail">FAIL</div>

<hr />

<h3>ie7-html4.js</h3>
<style type="text/css"><!--
 #ie7-html4 {background: black; height: 20px;}
 #ie7-html4 abbr {display: block; background: white; height: 20px;}
--></style>
<div id="ie7-html4"><abbr>&nbsp;</abbr></div>

<h3>ie7-box-model.js</h3>
<style type="text/css"><!--
 #ie7-box-model {background: black; height: 20px; overflow: hidden;}
 #ie7-box-model div.box {position: relative; top: -40px; background: white;
   height: 40px; border-top: 20px black solid;}
--></style>
<div id="ie7-box-model"><div class="box"></div></div>

<h3>ie7-png.js</h3>
<style type="text/css"><!--
 #ie7-png {background: white; height: 20px;}
 #ie7-png div.box {height: 20px; background: url(test-trans.png);}
--></style>
<div id="ie7-png"><div class="box"></div></div>

<h3>ie7-fixed.js</h3>
<style type="text/css"><!--
 #ie7-fixed {background: white; height: 20px;}
 #ie7-fixed div.box {position: fixed; top: -20px; background: black; height: 20px;}
--></style>
<div id="ie7-fixed"><div class="box"></div></div>

<h3>ie7-css2.js</h3>
<style type="text/css"><!--
 #ie7-css2 {background: black; height: 20px;}
 #ie7-css2 > span {display: block; background: white; height: 20px;}
--></style>
<div id="ie7-css2"><span>&nbsp</span></div>

<h3>ie7-css3.js</h3>
<style type="text/css"><!--
 #ie7-css3 {background: black; height: 20px;}
 #ie7-css3:empty {background: white;}
--></style>
<div id="ie7-css3"></div>

<h3>ie7-css-strict.js</h3>
<style type="text/css"><!--
 #ie7-css-strict {background: black; height: 20px;}
 #ie7-css-strict > span.strict {display: block; background: white; height: 20px;}
 #ie7-css-strict > span {display: block; background: black}
--></style>
<div id="ie7-css-strict"><span class="strict"></span></div>
</div>

<div class="footer">
<hr />
<a href="http://dean.edwards.name/IE7/"><img src="ie7.gif" width="80" height="15" alt="IE7 Enhanced"/></a>
</div>
</div>
</body>
</html>
